<?php
    $post = \App\Service\Area::orderBy('sort','asc')->get();
    if($post){
        $post->toArray();
    }
    else{
        $post = [];
    }
    $id = isset($request->area_id)?$request->area_id:17;
?>

@extends('.app.layout')

@section('title','郑州概况')
@section('head')
    <link href="/code/css/main.css" rel="stylesheet" />
    <script type="text/javascript" src="/code/js/tab1.js"></script>

@endsection
@section('content')
    <header class="mui-bar mui-bar-nav">
        <span class="mui-pull-left return" onclick="aOfApp('{{url('/app')}}',true)">
            <img src="/code/images/back.png" />
        </span>
        <h1 class="mui-title">郑州概况</h1>

    </header>
    <div class="mui-content mui-top">
        <div class="find_nav">
            <div class="find_nav_left">
                <div class="find_nav_list">
                    <ul>
                        @foreach($post as $v)
                            @if($v['id']==$id)
                                <li class="find_nav_cur">
                                    <a href="javascript:void(0)">{{$v['name']}}</a>
                                </li>
                            @else
                                <li>
                                    <a href="javascript:void(0)">{{$v['name']}}</a>
                                </li>
                            @endif

                        @endforeach
                    </ul>
                </div>
            </div>
        </div>
        <div class="line"></div>
        <div class="city-wrap-wrap">
        @foreach($post as $v)
                @if($v['id']==$id)
                    <div class="city-wrap">
                        {!! $v['content'] !!}
                    </div>
                @else
                    <div class="city-wrap hide_city">
                        {!! $v['content'] !!}
                    </div>
                @endif

        @endforeach
        </div>
    </div>
    <script>

        $(document).ready(function () {
//            $(".find_nav_list ul li").each(function () {
//                if($(this).hasClass("find_nav-cur")){
//                    var index2=$(".find_nav_list ul li").index(this);
//                    $(".city-wrap-wrap .city-wrap").eq(index2).show().siblings().hide();
//                }
//            })
            $(".find_nav_list ul li").click(function () {
                $(this).addClass("find_nav_cur").siblings().removeClass("find_nav_cur");
                var index=$(".find_nav_list ul li").index(this);
                $(".city-wrap-wrap .city-wrap").eq(index).removeClass("hide_city").siblings().addClass("hide_city");
            })
        })
    </script>
@endsection
@section('foot')
@endsection